import React, { useState, useEffect, } from 'react'
import Flushed from '../../Monitoring_analytics/Operate_monitor/Component/Flushed';
import Dropshipping from './Component/Dropshipping'
import Received from './Component/Received'
import Shipping from './Component/Shipping'
import Title from './Component/Title'
import { Tabs } from 'antd';
import type { TabsProps } from 'antd';


import { getshipment } from '../../../request/api'





export default function After_sales_management() {
  useEffect(() => {
    allgetafter()
  }, [])



  let [type, settype] = useState('待审核')

  // 获取全部的用户信息
  let [afterdata, setdata] = useState([])
  const allgetafter: any = async () => {
    const data: any = await getshipment({})
    console.log(data);
    setdata(data.data)
  }

  // 获取子组件传递的搜索完后的数据信息，更新用户信息
  const getTitle = (item: any) => {
    console.log(item);
    setdata(item)
  }

  // 接收列表子组件传递的修改状态的数据id
  const [list_id, setlist_id] = useState<any>([])
  const getid = (id: any) => {
    console.log(id);
    setlist_id(id)
  }
  // 接收title组件更改完数据之后，重新获取全部数据
  const getall = (item) => {
    console.log(item);
    if (item == 200) {
      allgetafter()
    }
  }
  

  const onChange = (key: string) => {
    console.log(key);
  };

  const items: TabsProps['items'] = [
    {
      key: '1',
      label: '代发货',
      children: <Dropshipping afterdata={afterdata} getid={getid} getall={getall}  ></Dropshipping>,
    },
    {
      key: '2',
      label: '送货中',
      children:<Received afterdata={afterdata} getid={getid} getall={getall} ></Received>,
    },
    {
      key: '3',
      label: '已收货',
      children: <Shipping afterdata={afterdata} getid={getid} getall={getall} ></Shipping>,
    },
  ];




  return (
    <div>
      <Title name='订单管理' getTitle={getTitle} list_id={list_id} getall={getall} ></Title>
      <Flushed></Flushed>
      <div style={{ width: '100%', backgroundColor: 'white', padding: '0.5rem', marginTop: '0.5rem' }}>
        <Tabs defaultActiveKey="1" items={items} onChange={onChange} />
      </div>
    </div>
  )
}
